<template>
	<view class="page-box">
		<view class="centerY pad-30" @click="hanldeSetPage">
			<image v-if="userInfo.avatar == ''" :src="defaultAvatar" class="avatar" mode="widthFix"></image>
			<image v-else class="avatar" mode="widthFix" :src="userInfo.avatar"></image>
			<view class="mar-left-30">
				<view class="centerY">
					<view class="font-32 color-text">{{userInfo.nickname}}</view>
					<!-- <view class="aut centerXY">
						<image class="aut-icon" src="../../../static/image/aut.png"></image>
						<text class="mar-left-7">已实名</text>
					</view> -->
				</view>
				<view class="font-30 color-646464">{{userInfo.tel}}</view>
			</view>
		</view>

		<view class="pad-30">
			<view class="wallet pad-40">
				<view class="color-white">
					<view class="font-26">会员储值</view>
					<view class="font-40 mar-top-5 bold">{{balanceInfo.amount}}</view>
				</view>
				<!-- <view class="centerXY">
					<view class="btn font-26 bgWhite color-primary mar-right-10">充值</view>
					<view class="btn font-26 color-white">提现</view>
				</view> -->
			</view>
		</view>

		<view class="pad-30">
			<view class="bgWhite radius30">
				<up-cell v-for="(item,index) in cellList" :icon="item.icon" :key="index" @click="jumpCell(item.path)"
					:border="false" size="large" :title="item.title" isLink></up-cell>
			</view>
		</view>
	</view>

	<suspend icon="/static/image/service.jpg"></suspend>
</template>

<script setup>
	import { ref } from 'vue';
	import { onShow, onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
	import { getBaseInfo, balanceDetail } from '@/api/index.js'
	import util from '@/util/share.js'
	import { dataReportFun } from '@/util/dataReport.js'
	import { postMultiGet } from '@/api/currency.js'


	const defaultAvatar = ref("");
	const getPostMultiGet = () => {
		postMultiGet({ codes: ['user_default_avatar'] }).then(res => {
			defaultAvatar.value = res.data.lists.user_default_avatar;
		})
	}


	onLoad((option) => {
		dataReportFun({
			event: "client.page_view",
		})
		util.friends();
	})


	let cellList = ref([{
			icon: "/static/image/my1.png",
			title: "我的钱包",
			path: "/pages/my_actions/balanceLog/balanceLog"
		},
		{
			icon: "/static/image/my2.png",
			title: "我的优惠券",
			path: "/pages/my_actions/coupon/coupon"
		},
		{
			icon: "/static/image/city.png",
			title: "常用地址",
			path: "/pages/address/list"
		},
		{
			icon: "/static/image/my2.png",
			title: "兑换",
			path: "/pages/exchangeLog/exchangeLog"
		},
		{
			icon: "/static/image/my2.png",
			title: "推广中心",
			path: "/pages/extension/home/home"
		},
		{
			icon: "/static/image/my2.png",
			title: "我的收藏",
			path: "/pages/my_actions/collectionLog/collectionLog"
		},
		{
			icon: "/static/image/my3.png",
			title: "个人设置",
			path: "/pages/my_actions/userSet/userSet"
		}
	])

	const jumpCell = (path) => {
		uni.navigateTo({
			url: path
		})
	}

	// 个人设置
	const hanldeSetPage = () => {
		uni.navigateTo({
			url: "/pages/my_actions/userSet/userSet"
		})
	}

	// 获取用户信息
	const userInfo = ref({});
	const balanceInfo = ref({})
	const getUserInfo = () => {
		getBaseInfo().then(res => {
			if (res?.code == 200) {
				let info = res.data.info;
				info.tel = info.tel.replace(/^(\d{3})\d{4}(\d{4})$/, '\$1****\$2')
				userInfo.value = info;

				uni.setStorageSync('userId', res.data.info.id);
			}
		})

		balanceDetail().then(res => {
			if (res?.code == 200) {
				balanceInfo.value = res.data.info;
			}
		})
	}

	// 跳转常用地址
	const hanldeAddress = () => {
		uni.navigateTo({
			url: '/pages/address/list'
		})
	}

	onShow(() => {
		getUserInfo();
		getPostMultiGet();
	})


	// 分享
	onShareAppMessage(() => {
		return util.onShare({
			path: `/pages/index/index`
		})
	})

	onShareTimeline(() => {
		let uid = "";
		if (uni.getStorageSync('userId')) {
			uid = uni.getStorageSync('userId');
		}

		let imageUrl = uni.getStorageSync('shareCover');
		return {
			query: `uid=${uid}&ref=wxmini_user_share`,
			title: "心宇利家政",
			imageUrl: imageUrl
		}
	})
</script>

<style lang="scss" scoped>
	.bgWhite {
		background: white;
	}

	.btn {
		width: 140rpx;
		height: 54rpx;
		border-radius: 50rpx;
		border: 1px solid #FFFFFF;
		line-height: 54rpx;
		text-align: center;
	}

	.wallet {
		background: url('https://file.xyljz.cn/upload/2024/11/20/17321071862341332.png');
		width: 100%;
		background-size: cover;
		height: 180rpx;
		display: flex;
		justify-content: space-between;
	}

	.aut-icon {
		display: block;
		width: 32rpx;
		height: 26rpx;
	}

	.icon {
		width: 50rpx;
		height: 50rpx;
	}

	.aut {
		width: 140rpx;
		height: 50rpx;
		background: linear-gradient(135deg, #5F5F5F 0%, #161616 100%);
		border-radius: 25rpx;
		text-align: center;
		line-height: 50rpx;
		margin-left: 15rpx;
		font-size: 24rpx;
		color: #FCEEE1;
	}

	.avatar {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
	}
</style>